//消息统计
<template>
    <div class="common-layout">
        <el-container>
            <!-- 侧边栏 -->
            <el-aside style="width: 160px;">
                <div class="aside_left">
                    <el-col :span="12">
                        <el-menu default-active="1" router class="el-menu-vertical-demo" :default-openeds="arr"
                            :collapse="isnull">
                            <el-sub-menu index="1">
                                <template #title>
                                    <el-icon>
                                        <ChatDotSquare />
                                    </el-icon>
                                    <span>消息发布概况</span>
                                </template>
                                <el-menu-item index="1-1" route="/home/messagestatistics/summessage">消息发布概况</el-menu-item>
                                <el-menu-item index="1-2" route="/home/messagestatistics/sendmessage">消息发布列表</el-menu-item>
                                <el-menu-item index="1-3"
                                    route="/home/messagestatistics/schoolsort">学校月消息发布排行</el-menu-item>
                                <el-menu-item index="1-4"
                                    route="/home/messagestatistics/teachersort">老师月消息发布排行</el-menu-item>
                            </el-sub-menu>

                        </el-menu>
                    </el-col>
                </div>
            </el-aside>
            <el-container>
                <el-header class="bottom_header">
                <!-- <div class="ico">
                        <el-icon v-if="!isnull" @click="change">
                            <Fold />
                        </el-icon>
                        <el-icon v-else="isnull" @click="change">
                            <Expand />
                        </el-icon>
                            </div> -->

                </el-header>
                <el-main style="background-color: #f7f7f7; height: 100%;"><router-view></router-view></el-main>
            </el-container>
        </el-container>
    </div>
</template>


<script setup lang="ts">
import { reactive, toRefs } from 'vue'
import { ref, onMounted } from 'vue';
var isnull = ref(false)
var arr = ref(["1"])
const change = () => {
    isnull.value = !isnull.value

}
</script>

<style scoped>
.bottom_header {
    background-color: #fff;
    height: 40px;
    z-index: 30;
    margin-left: -2px;
    display: flex;
    align-items: center;
}

.aside_left {
    width: 160px;
    margin-top: 20px;
}

:deep() .el-sub-menu__title {
    width: 150px;
    margin-top: 20px;
}

:deep() .el-sub-menu__title,
.el-menu-item {
    font-size: 12px;
    height: 30px;
}

:deep() .el-col-12 {
    max-width: none;
}

::-webkit-scrollbar {
    display: none;

}
</style>